<template>
  <div>
    <a-row :span="20" style="margin: 10px 25px 20px 5px">
      <div class="Select_part">
          <div class="Select_part_head">
                <div class="Select_part_head_title">
                请选择学院专业
                </div>
          </div>
          <div class="Select_part_body">
            <div>
                <div class="Select_part_body_title">学院 <a-icon style="color:#4ABAC4;font-size:12px" @click="addSubOrgVisible = true" type="plus" /></div>
                <div class="Select_part_body_content">
                  <div v-for=" (item,index) in all_suborgs" :key="index" class="Select_part_body_content_buttonGroup">
                        <input v-focus v-if="editSubForm.editIndex===index" class="Select_part_body_content_buttonGroup_input" v-model="editSubForm.editSub"/>
                        <div v-else class="Select_part_body_content_buttonGroup_button"  @click="chooseSubOrg(item,index)" name="SubOrg">
                                {{item.subOrgName }} 
                        </div>
                
                        &nbsp;
                        
                      <div class="Select_part_body_content_icon" v-if="editSubForm.editIndex===index">
                        <a-tooltip placement="top" title="保存">
                        <a-button   
                              icon="check"
                              style="color: white"
                              size="small"
                              type="link"
                              @click="handleChange_SubOrgsName()"
                        ></a-button>
                        </a-tooltip>

                        <a-tooltip placement="top" title="取消">
                        <a-button
                              icon="close"
                              style="color: white"
                              size="small"
                              type="link"
                              @click="cancleChange_SubOrgsName()"
                        ></a-button>
                        </a-tooltip>
                      </div>

                      <div v-else class="Select_part_body_content_buttonGroup_icon">
                        <a-tooltip placement="top" title="修改">
                        <a-button 
                              icon="edit"
                              style="color: white"
                              size="small"
                              type="link"
                              @click="change_SubOrgsName(item.subOrgName,index)"
                        ></a-button>
                        </a-tooltip>
                        <a-tooltip placement="top" title="删除">
                        <a-button
                              icon="minus"
                              style="color: white"
                              size="small"
                              type="link"
                              @click="delete_SubOrgsName(item.subOrgName)"
                        ></a-button>
                        </a-tooltip>
                      </div>
                  </div>
                </div>
          </div>
         <div v-if="visible ">
                <div class="Select_part_body_title">专业 <a-icon style="color:#4ABAC4;font-size:12px" @click="addMajorVisible = true" type="plus" /></div>
                <div  class="Select_part_body_content">
                      <div v-for="(mName,index) in major_names"  :key="index" class="Select_part_body_content_buttonGroup">
                          <input v-focus v-if="editMajorForm.editIndex===index" class="Select_part_body_content_buttonGroup_input" v-model="editMajorForm.editMajor">
                          <div v-else class="Select_part_body_content_buttonGroup_button"  @click="chooseClass(mName.majorName,index)" name="MajorName">{{mName.majorName}}</div>
                          &nbsp;
                      <div class="Select_part_body_content_icon" v-if="editMajorForm.editIndex===index">
                        <a-tooltip placement="top" title="保存">
                        <a-button   
                              icon="check"
                              style="color: white"
                              size="small"
                              type="link"
                              @click="handleChange_Major()"
                        ></a-button>
                        </a-tooltip>

                        <a-tooltip placement="top" title="取消">
                        <a-button
                              icon="close"
                              style="color: white"
                              size="small"
                              type="link"
                              @click="cancleChange_Major()"
                        ></a-button>
                        </a-tooltip>
                      </div>

                      <div class="Select_part_body_content_icon" v-else>
                        <a-tooltip placement="top" title="修改">
                        <a-button 
                              icon="edit"
                              style="color: white"
                              size="small"
                              type="link"
                              @click="change_Major(mName.majorName,index)"
                        ></a-button>
                        </a-tooltip>
                        <a-tooltip placement="top" title="删除">
                        <a-button
                              icon="minus"
                              style="color: white"
                              size="small"
                              type="link"
                              @click="delete_Major(mName.majorName)"
                        ></a-button>
                        </a-tooltip>
                      </div>
                     </div>
                </div>
          </div>
      </div>
  </div>
      <!--<a-spin :spinning="Tree_spin_status" tip="Loading...">
        <a-tree-select
          style="width: 100%"
          :value="value"
          :placeholder="orgName"
          :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
          allow-clear
          tree-default-expand-all
          @change="onChange"
        >
          <a-tree-select-node
            :key="item._id"
            :value="`${item._id}#`"
            :title="item._id"
            v-for="item in treeData"
          >
            <a-tree-select-node
              :key="mName"
              :value="`${mName}:${item._id}`"
              :title="mName"
              v-for="mName in item.majors"
            >
            </a-tree-select-node>
          </a-tree-select-node>
        </a-tree-select>
      </a-spin>-->
    </a-row>

    <div class="four-btn">
      <!-- <a-col :span="5"> </a-col>
      <a-col :span="10"></a-col>
      <a-col :span="9"> -->
      <!-- <a-space> -->
    <!--  <button class="content-btn" @click="addSubOrgVisible = true">
        添加学院
      </button>
      <button class="content-btn" @click="addMajorVisible = true">
        添加专业
      </button>-->
       <a-input-search @search="onSearch"  placeholder="班级搜索" enter-button  class="search"/>
      <button class="content-btn" @click="addClassVisible = true">
        添加班级
      </button>
      <button class="content-btn" @click="showDeleteConfirms(selectedClasses)">批量删除</button>
      <!-- </a-spe>
      </a-col> -->
    </div>
    <br />
    <!-- pageSizeOptions: pageSize, -->
    <a-spin :spinning="spin_status" tip="Loading...">
      <a-table
        rowKey="_id"
        size="small"
        :pagination="{
          total: classList.length,
          defaultPageSize: 20,
          'hide-on-single-page': true,
        }"
        :bordered="true"
        :row-selection="{
          selectedRowKeys: selectedClasses,
          onChange: onSelectChange,
        }"
        :columns="columns"
        :data-source="classList"
      >
        <template #operation="record">
          <a-button type="link" @click="viewClassInfo(record)">详情</a-button>
          <a-button type="link" @click="editclass(record)">编辑</a-button>
          <a-button type="link" @click="deleteclass(record)">删除</a-button>
        </template>
      </a-table>
    </a-spin>
    <!-- 添加专业对话框 -->
    <a-modal
      v-model="addMajorVisible"
      title="添加专业"
      @ok="submitAddMajor"
      :maskClosable="false"
    >
      <a-form-model :label-col="labelCol" :wrapper-col="wrapperCol">
        <a-form-model-item label="学校">
          {{ orgName }}
        </a-form-model-item>
        <a-form-model-item label="学院">
          <a-select v-model="addMajorForm.addMajor_subOrg_id" >
            <a-select-option
              v-for="item in colleges"
              :key="item._id"
              :value="item._id"
            >
              {{ item.subOrgName }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="专业名">
          <a-input
            placeholder="请输入专业名"
            v-model="addMajorForm.majorName"
          ></a-input>
        </a-form-model-item>
        <a-form-model-item label="专业简介">
          <a-textarea
            placeholder="请输入专业简介"
            v-model="addMajorForm.majorIntro"
            :auto-size="{ minRows: 3 }"
          >
          </a-textarea>
        </a-form-model-item>
      </a-form-model>
    </a-modal>
    <!-- 添加学院对话框 -->
    <a-modal
      v-model="addSubOrgVisible"
      title="添加学院"
      @ok="submitAddSubOrg"
      :maskClosable="false"
    >
      <a-form-model
        :model="addSubForm"
        :label-col="labelCol"
        :wrapper-col="wrapperCol"
        :rules="subOrgFormRules"
      >
        <a-form-model-item label="学校名称">
          {{ orgName }}
        </a-form-model-item>
        <a-form-model-item label="学院名称" prop="subOrgName">
          <a-input
            placeholder="请输入学院名称"
            v-model="addSubForm.subOrgName"
          ></a-input>
        </a-form-model-item>
        <a-form-model-item label="学院简介" prop="subOrgIntro">
          <a-textarea
            placeholder="请输入学校简介"
            v-model="addSubForm.subOrgIntro"
            :auto-size="{ minRows: 3 }"
          >
          </a-textarea>
        </a-form-model-item>
      </a-form-model>
    </a-modal>
    <!-- 添加班级对话框 -->
    <a-modal
      v-model="addClassVisible"
      title="添加"
      @ok="submitAddClass"
      :maskClosable="false"
    >
      <a-form-model
        :model="addclass"
        :label-col="labelCol"
        :wrapper-col="wrapperCol"
        :rules="formRules"
      >
        <a-form-model-item label="学校" prop="add_org_name">
          {{ orgName }}
        </a-form-model-item>
        <a-form-model-item label="学院" prop="add_subOrg_name">
          <a-select v-model="subOrg_name" >
            <a-select-option
              v-for="item in colleges"
              :key="item._id"
              :value="item.subOrgName"
            >
              {{ item.subOrgName }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="专业" prop="add_major_name">
          <a-select v-model="addclass.add_major_name" >
            <!-- v-model="form.major_name" -->
            <a-select-option
              v-for="item in major_names"
              :key="item._id"
              :value="item.majorName"
            >
              {{ item.majorName }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="入学时间">
          <a-select v-model="addclass.EnrolmentDate">
            <!-- v-model="form.major_name" -->
            <a-select-option
              v-for="EnrolmentDate in EnrolmentDateList"
              :key="EnrolmentDate"
            >
              {{ EnrolmentDate }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="班级编号">
          <a-select v-model="addclass.class_number">
            <!-- v-model="form.major_name" -->
            <a-select-option v-for="number in 10" :key="number">
              {{ number }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="班级名" prop="add_class_name">
          <a-input
            placeholder="请输入班级名"
            v-model="addclass.add_class_name"
          ></a-input>
        </a-form-model-item>
        <!-- 学生怎么加？？？ -->
      </a-form-model>
    </a-modal>
    <!-- 编辑对话框 -->
    <a-modal v-model="editModal_visible" title="编辑班级" @ok="edit_submit">
      <a-form
        :modal="edit_class"
        :label-col="{ span: 5 }"
        :wrapper-col="{ span: 12 }"
      >
        <a-form-model-item label="学院">
          <a-select v-model="subOrg_name">
            <a-select-option
              v-for="item in colleges"
              :key="item._id"
              :value="item.subOrgName"
            >
              {{ item.subOrgName }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="专业">
          <!-- <a-input v-model="form.title" /> -->
          <a-select v-model="edit_class.major_name">
            <a-select-option
              v-for="item in major_names"
              :key="item._id"
              :value="item.majorName"
            >
              {{ item.majorName }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="班级名称">
          <a-input v-model="edit_class.class_name" />
        </a-form-model-item>
      </a-form>
    </a-modal>
  </div>

</template>

<script>
import { mapState } from "vuex";
import axiosInstance from "@/utils/axios";
import moment from "moment";

export default {
  directives:{
    focus:{
      inserted:(el)=>{ el.focus() },
      update:(el) =>{el.focus( )}  
     }
  },
  data() {
    return {
      visible:false,
      all_suborgs:[],
      selectedOrgsName:undefined,
      selectedMajorName:undefined,
      all_selected : {
          subOrg_name: "",
          major_name: ""
      },
      editSubForm:{   //编辑学院表格
        editIndex:-1,
        editSub:"",
        },
      editMajorForm:{  //编辑专业
         editIndex:-1,
         editMajor:"",
      },
      major_visible:false,
      orgsName_visible:false,
      // treeSpin_status: false,
      // spin_status: false,
      // 刷新
      refresh: 0,
      // 选择树
      value: undefined,
      pageSize: ["10", "20", "30", "50", "100"],
      //treeData: [],
      // 编辑对话框
      edit_record_id: "",
      editModal_visible: false,
      edit_class: {
        subOrg_name: "",
        major_name: "",
        class_name: "",
      },
      major_names: [],
      // major_names: [{major_name:"软件工程"},{major_name:"人工智能"}],
      colleges: [],
      teacherList: [],
      // 添加班级对话框
      addClassVisible: false,
      addSubOrgVisible: false,
      addMajorVisible: false,
      labelCol: { span: 4 },
      wrapperCol: { span: 14 },
      addclass: {
        add_subOrg_name: "",
        add_major_name: "",
        add_class_name: "",
        EnrolmentDate: "",
        class_number: "",
      },

      addMajorForm: {
        addMajor_subOrg_id: "",
        subOrgName: "",
        majorName: "",
        majorIntro: "",
      },
      addSubForm: {
        organzationName: this.orgName,
        subOrgName: "",
        subOrgIntro: "",
      },
      subOrg_name: "",
      //
      currentNode: "1",
      formRules: {
        add_class_name: [{ required: true, message: "班级名不能为空" }],
      },
      subOrgFormRules: {
        subOrgName: [{ required: true, message: "学院名不能为空" }],
      },
      columns: [
        {
          title: "班级名称",
          dataIndex: "class_name",
          align: "center",
        },
        {
          title: "学院",
          dataIndex: "subOrg_name",
          align: "center",
        },
        {
          title: "专业",
          dataIndex: "major_name",
          align: "center",
        },
        {
          title: "入学时间",
          dataIndex: "EnrolmentDate",
          align: "center",
        },
        {
          title: "班级编号",
          dataIndex: "class_number",
          align: "center",
        },
        {
          title: "学生数量",
          dataIndex: "studentNum",
          align: "center",
        },
        {
          title: "操作",
          align: "center",
          scopedSlots: { customRender: "operation" },
        },
      ],
      selectedClasses: [],
      classList: [],
      classLists: [],
      classListss: [],
    };
  },
  computed: {
    EnrolmentDateList() {
      let year = moment().year();
      return [year - 3, year - 2, year - 1, year, year + 1, year + 2, year + 3];
    },
    ...mapState({
      Tree_spin_status: (state) => state.admin.Tree_spin_status,
      spin_status: (state) => state.admin.spin_status,
      orgName: (state) => state.public.orgName,
      oid: (state) => state.public.oid,
    }),
  },
  created() {
    // 获取班级
    this.getclassdata();
  },
  mounted() {
    // 获取学院名
    this.getSubOrgsName();
    this.getClassesFromCondition();
    // 获取选择树
    //this.getTreeData();
  },
  watch: {
    refresh(val) {
      this.getclassdata();
      //this.getTreeData();
    },
    subOrg_name(val) {
      // 根据学院找到专业赋值
      this.addclass.add_subOrg_name = val;
      this.edit_class.subOrg_name = val;
      // if (this.subOrg_name !== record.subOrg_name) {
      //   this.edit_class.major_name = ""; //一旦改变学院，清空原始数据
      //   this.edit_class.class_name = "";
      // }
      // console.log(val)
      this.getmajors(val);
    },
  },
  methods: {

    /*async getTreeData() {
      let queryString = this.orgName;
      const url = "/pc/v1/classes/classTree?org_name=" + queryString;
      // console.log(url);
      try {
        // this.treeSpin_status = true;
        this.$store.dispatch("admin/change_Tree_spin_status", true);
        const { data } = await axiosInstance.get(url);
        this.$store.dispatch("admin/change_Tree_spin_status", false);
        if (data.result.message == "班级树形数据为空") {
          return;
        }
        this.treeData = data.result;
      } catch (err) {
        this.$store.dispatch("admin/change_Tree_spin_status", false);
        console.log(err);
      }
    },*/
    async getmajors(queryString) {
      // 按获取专业
      //console.log(queryString)
      // console.log(this.orgName)
      const url =
        "/pc/v1/organizations/" + this.orgName + "/suborgs/" + queryString;
      try {
        const { data } = await axiosInstance.get(url);
        // console.log(data)
        // 选择树的专业
        //this.major_names = data.majors;
        // 选择树下方的专业
        this.major_names=data.majors;
        //console.log(this.major_names);
        // console.log(data.data.majors);
      } catch (err) {
        console.log(err);
      }
    },
    async getSubOrgsName() {
      // 获取学院名
      const url = "/pc/v1/organizations/" + this.oid + "/suborgs";
      try {
        const { data } = await axiosInstance.get(url);
        this.colleges = data.subOrgs;
        this.all_suborgs=data.subOrgs;
        console.log(this.all_suborgs);
      } catch (err) {
        console.log(err);
      }
    },
    async getclassdata() {
      // 获取全部班级信息
      const url = "/pc/v1/classes";
      try {
        // this.spin_status = true;
        this.$store.dispatch("admin/change_spin_status", true);
        const { data } = await axiosInstance.get(url);
        // this.spin_status = false;
        this.$store.dispatch("admin/change_spin_status", false);
        // console.log("---data---");
        // console.log(data.data.classes);
        this.classList = data.data.classes;
        this.classList.map((item) => {
          item.studentNum = item.students.length;
        });
        // console.log("-----classList-----")
        // console.log(this.classList)
      } catch (err) {
        this.$store.dispatch("admin/change_spin_status", false);
        console.log(err);
      }
    },
    async submitAddSubOrg() {
      try {
        const url = `/pc/v1/organizations/${this.oid}/subOrgs/`;
        const requestBody = this.addSubForm;
        const data = await axiosInstance.post(url, requestBody);
        this.$message.info("添加成功");
        this.addSubOrgVisible = false;
        // 重新加载选择树
        //this.getTreeData();
        this.getSubOrgsName();
      } catch (err) {
        this.$message.error("添加失败");
        console.log(err);
      }
    },
    async submitAddMajor() {
      try {
        const url = `/pc/v1/organizations/${this.oid}/subOrgs/${this.addMajorForm.addMajor_subOrg_id}`;
        //console.log(this.addMajorForm.addMajor_subOrg_id);
        const requestBody = this.addMajorForm;
        console.log(
          "🚀 ~ file: InstitutionTable.vue ~ line 459 ~ submitAddMajor ~ requestBody",
          requestBody
        );
        const data = await axiosInstance.post(url, requestBody);
        this.$message.info("添加成功");
        this.addMajorVisible = false;
        // 重新加载选择树
       // this.getTreeData();
        this.getmajors(this.selectedOrgsName);
      } catch (err) {
        this.$message.error("添加失败");
        console.log(err);
        this.addMajorVisible = false;
      }
    },
    submitAddClass() {
      // 添加班级对话框的确定
      const {
        add_subOrg_name,
        add_major_name,
        add_class_name,
        EnrolmentDate,
        class_number,
      } = this.addclass;
      let add_org_name = this.orgName;
      const requestData = {
        org_name: add_org_name,
        subOrg_name: add_subOrg_name,
        major_name: add_major_name,
        class_name: add_class_name,
        EnrolmentDate,
        class_number,
      };
      console.log(
        "🚀 ~ file: InstitutionTable.vue ~ line 502 ~ submitAddClass ~ requestData",
        requestData
      );
      // console.log(this.addclass)
      const url = `pc/v1/classes`;
      axiosInstance
        .post(url, requestData)
        .then(({ data }) => {
          // console.log(data);
          this.$message.info("添加成功！");
          this.refresh += 1;
        })
        .catch(() => {
          this.$message.error("添加失败，请重试！");
        });
      this.addClassVisible = false;
    },
    // 表格选择
    onSelectChange(selectedKeys) {
      // 表格信息的选中
      this.selectedClasses = selectedKeys;
    },
    onSearch(val) {
      console.log(this.classListss);
      this.classLists = this.classList;
      console.log(this.classLists);
      if(val == ""){
        this.classList = this.classListss;
      } 
      else{
        this.classLists = this.classLists.filter((classlist) => {
          return classlist.class_name.includes(val);
        });
        this.classList = this.classLists;
      }
    },
    handle() {
      this.$store.commit("changeState", true);
    },
    viewClassInfo(record) {
      // console.log(record)
      this.$router.push({
        name: "admin_classinfo",
        query: {
          classId: record.id,
          orgName: this.orgName,
          subOrg_name: record.subOrg_name,
          major_name: record.major_name,
          class_name: record.class_name,
        },
      });
    },
    // 删除班级
    async deleteclass(record) {
      // console.log("---record---");
      // console.log(record);
      await this.showDeleteConfirm(record._id);
    },
    showDeleteConfirm(deleteList) {
      console.log(deleteList);
      var that = this;
      deleteList.length == 0
        ? this.$message.info("请选中要删除的项")
        : this.$confirm({
            title: "确认删除吗",
            content: "数据删除后不可恢复",
            okText: "确定",
            okType: "danger",
            cancelText: "取消",
            async onOk() {
              // console.log(deleteList);
              //post deleteList
              const url = "/pc/v1/classes/" + deleteList;
              try {
                await axiosInstance.delete(url);
                that.$message.info("删除成功！");
                that.refresh += 1;
              } catch (err) {
                console.log(err);
                that.$message.error("删除失败，请重试！");
              }
            },
            onCancel() {
              // console.log("Cancel");
            },
          });
    },

//批量删除班级
      showDeleteConfirms(deleteList) {
      const requestbody={classes_id:deleteList}
      var that = this;
      deleteList.length == 0
        ? this.$message.info("请选中要删除的项")
        : this.$confirm({
            title: "确认删除吗",
            content: "数据删除后不可恢复",
            okText: "确定",
            okType: "danger",
            cancelText: "取消",
            async onOk() {
              // console.log(deleteList);
              //post deleteList
              const url = "/pc/v1/classes/mutipleDeleteClass";
              try {
                await axiosInstance.post(url,requestbody);
                that.$message.info("删除成功！");
                that.refresh += 1;
              } catch (err) {
                console.log(err);
                that.$message.error("删除失败，请重试！");
              }
            },
            onCancel() {
              // console.log("Cancel");
            },
          });
    },
    // 编辑班级
    editclass(record) {
      // console.log("record:"+record._id)
      this.edit_record = record._id;
      this.editModal_visible = true;
      // 编辑
      this.edit_class = record;
      this.subOrg_name = record.subOrg_name;
      // console.log(this.edit_class);
    },
    edit_submit() {
      // console.log(this.edit_class);
      //post form
      const requestData = {
        org_name: this.orgName,
        subOrg_name: this.edit_class.subOrg_name,
        major_name: this.edit_class.major_name,
        class_name: this.edit_class.class_name,
      };
      // console.log(requestData);
      const url = `pc/v1/classes/` + this.edit_record;
      axiosInstance
        .patch(url, requestData)
        .then(({ data }) => {
          // console.log(data.status);
          this.$message.info("修改成功");
          this.refresh += 1;
        })
        .catch(() => {
          this.$message.error("修改失败，请重试！");
        });
      this.editModal_visible = false;
    },
    onChange(data, label) {
      // console.log(data)
      let payload = {};
      if (data.slice(-1) == "#") {
        let temp = data.slice(0, -1);
        payload = { subOrg_name: temp };
        this.getClassesFromCondition(payload);
        // console.log(payload);
      } else {
        payload = {
          subOrg_name: data.substring(data.indexOf(":") + 1),
          major_name: data.substring(0, data.indexOf(":")),
        };
        this.getClassesFromCondition(payload);
        // console.log(payload);
      }
      this.value = label;
    },
    async getClassesFromCondition(payload) {
      // 按条件检索班级
      const url = "/pc/v1/classes/search";
      try {
        const { data } = await axiosInstance.post(url, payload);
        // console.log("--classes----");
        // console.log(data.data.classes);
        this.classList = data.data.classes;
        this.classListss = data.data.classes;
        this.classList.map((item) => {
          item.studentNum = item.students.length;
        });
      } catch (err) {
        console.log(err);
      }
    },
      chooseSubOrg(item,index){
    let All = document.getElementsByName("SubOrg");
    All[index].className = "Select_part_body_content_buttonGroup_buttonSelected";
      for(let i = 0; i < this.all_suborgs.length; i++) {
        if( i != index) {
          All[i].className = "Select_part_body_content_buttonGroup_button";
        }
      }
      
     All = document.getElementsByName("MajorName");
      for(let i = 0; i < this.major_names.length; i++) {
          All[i].className ="Select_part_body_content_buttonGroup_button";
      }
    this.visible= true;
    this.selectedOrgsName=item.subOrgName;
    this.subOrg_name=item.subOrgName;
    this.addMajorForm.addMajor_subOrg_id=item._id;
    this.getmajors(item.subOrgName)
    this.all_selected.subOrg_name=item.subOrgName;
   },
   chooseClass(major,index){
     let All = document.getElementsByName("MajorName");
     All[index].className = "Select_part_body_content_buttonGroup_buttonSelected";
      for(let i = 0; i < this.major_names.length; i++) {
        if( i != index) {
          All[i].className ="Select_part_body_content_buttonGroup_button";
        }
      }
     this.all_selected.major_name=major;
     this.addclass.add_major_name=major;
     this.getClassesFromCondition(this.all_selected);
   },
   async delete_SubOrgsName(queryString) {
      // 删除学院
      console.log(queryString);
      var that=this;
      this.$confirm({
            title: "确认删除吗",
            content: "数据删除后不可恢复",
            okText: "确定",
            okType: "danger",
            cancelText: "取消",
            async onOk() {
                  const url =
                    "/pc/v1/organizations/" + that.oid + "/suborgs?subOrgName="+queryString;
                  try {
                    await axiosInstance.delete(url);
                    that.$message.info("删除成功！")
                    that.getSubOrgsName();
                    that.classList=[];
                    that.major_names=[];
                  } catch (err) {
                    that.$message.info("删除失败！")
                    console.log(err);
                  }
                },
            onCancel() {
               console.log("Cancel");
            },
          });
   },
    change_SubOrgsName(item,index){
      console.log("修改学院");
      this.editSubForm.editSub=item;
      this.editSubForm.editIndex=index;
      this.selectedOrgsName=item;
    },
    handleChange_SubOrgsName(){
     const url =  "/pc/v1/organizations/updateSubOrg/" + this.oid  ;
     console.log(this.selectedOrgsName);
     console.log(this.editSubForm.editSub);
      axiosInstance
        .patch(url,{
          oldSubOrgName:this.selectedOrgsName,
          newSubOrgName:this.editSubForm.editSub,
        })
        .then(() => {
          // console.log(data.status);
          this.$message.info("修改成功");
          this.getSubOrgsName();
          this.editSubForm.editIndex= -1;
        })
        .catch(() => {
          this.$message.error("修改失败，请重试！");
        });
      
    },
    cancleChange_SubOrgsName(){
        this.editSubForm.editIndex= -1;
    },

    
    change_Major(item,index){
      this.editMajorForm.editMajor=item;
      this.editMajorForm.editIndex=index;
      this.selectedMajorName=item;
      console.log("修改专业");
    },
    handleChange_Major(){
        const url =  "/pc/v1/organizations/" + this.oid + "/suborgs/" + this.selectedOrgsName;
      axiosInstance
        .patch(url,{
             subOrgName:this.selectedOrgsName,
             majorName:this.selectedMajorName,
             newMajorName:this.editMajorForm.editMajor,
        })
        .then(() => {
          // console.log(data.status);
          this.$message.info("修改成功");
           this.getmajors(this.selectedOrgsName);
          this.editMajorForm.editIndex= -1;
        })
        .catch(() => {
          this.$message.error("修改失败，请重试！");
           this.editMajorForm.editIndex= -1;
        });

    },
    cancleChange_Major(){
        this.editMajorForm.editIndex= -1;
    },
    
    async delete_Major(queryString) {
      // 删除专业
      console.log(queryString);
      var that=this;
      this.$confirm({
            title: "确认删除吗",
            content: "数据删除后不可恢复",
            okText: "确定",
            okType: "danger",
            cancelText: "取消",
            async onOk() {
                  const url =
                    "/pc/v1/organizations/deleteSuborgs/" + that.oid;
                  try {
                    await axiosInstance.post(url,{
                      subOrgName:that.all_selected.subOrg_name,
                      majorName:queryString,
                    });
                    that.$message.info("删除成功！")
                    that.getmajors(that.all_selected.subOrg_name);
                    that.classList=[];
                  } catch (err) {
                    that.$message.info("删除失败！")
                    console.log(err);
                  }
                },
            onCancel() {
               console.log("Cancel");
            },
          });
   },
  },

};
</script>

<style lang="scss" scoped>
/* .btn .ant-btn {
  margin: 0 5px;
} */
::v-deep .ant-table-row {
  padding-top: 0;
}
::v-deep .ant-table-small > .ant-table-content > .ant-table-body {
  margin: 0;
}
::v-deep
  .ant-table-small
  > .ant-table-content
  > .ant-table-body
  > table
  > .ant-table-tbody
  > tr
  > td {
  padding: 5px 5px;
}

/*.Select_part{
    position: relative;
    min-height: 1px;
   // padding-left: 10px;
    //padding-right: 10px;
    border-width:1px;
    border-style :solid;
    border-color:#4ABAC4;
}
.Select_part_head{
    color: white;
    background-color:#4ABAC4;
}
.Select_part_head_title{
    margin-top: 0;
    margin-bottom: 0;
    font-size: 18px;
    padding-left: 10px;
    color: inherit;
}
.Select_part_body{
  padding: 15px;
}
.Select_part_body_title{
  font-size: 16px;
  color: #004e49;
}
.Select_part_body_content{
  padding: 0px 10px;
    //padding-top: 7.98px;
    //padding-bottom: 6px;
}
.Select_button{
    color: white;
    background-color:#4ABAC4;
    //margin-right: 18px;
    //margin-top: 4px;
    //margin-bottom: 4px;
    border:0;
    //padding-top: 5px;
    //padding-bottom: 5px;
    border:none;
    outline:medium;
   padding-right: 12px;
    padding-left: 12px;
   line-height:0
}
.Select_button:active{
  opacity: 0.5;
}
.Select_part_button{
  display: inline-block;
  background-color:#4ABAC4;
    margin-right: 18px;
    margin-top: 4px;
    margin-bottom: 4px;
    padding: 3px 3px;
    // padding-top: 5px;
    //padding-bottom: 5px;
}*/

.search{
  float: left;
  // display: flex;
  width: 200px;
  color:blue;
}
</style>
